<script setup>
import { open } from '@tauri-apps/plugin-dialog';
import { ref, reactive } from 'vue';
import { FolderOpened } from '@element-plus/icons-vue'
import { invoke } from '@tauri-apps/api/core';
const formSize = ref('default')
const ruleFormRef = ref()
const ruleForm = reactive({
    name: '文件名称',
    scan_path: '',
    exp_path: '',
    scan_type: '',
    gen_page: 60
})
const rules = reactive({
    name: [
        { required: true, message: '请输入文件名称', trigger: 'blur' }
    ]
})

const fileType = ref(["java", "vue", "js"])

const selectDirSrc = async () => {
    const selected = await open({
        multiple: false,
        directory: true,
    })
    ruleForm.scan_path = selected
}

const selectExpPath = async () => {
    const selected = await open({
        multiple: false,
        directory: true,
    })
    ruleForm.exp_path = selected
}

const submitForm = async (values) => {
    console.log(values);
    await invoke('code_extranction', {data:values}).then(res => {
        alert(res)
    })
}

</script>

<template>
    <el-container class="code-container">
        <el-main>
            <el-form ref="ruleFormRef" style="max-width: 600px" :model="ruleForm" :rules="rules" label-width="auto"
                :size="formSize" status-icon>
                <el-form-item label="项目名称：" prop="name">
                    <el-input v-model="ruleForm.name" />
                </el-form-item>
                <el-form-item label="扫描路径" prop="region">
                    <el-input v-model="ruleForm.scan_path" placeholder="请选择扫描的文件路径">
                        <template #append>
                            <el-button type="primary" :icon="FolderOpened" @click="selectDirSrc"
                                size="small"></el-button>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item label="导出路径" prop="region">
                    <el-input v-model="ruleForm.exp_path" placeholder="请选择导出的文件路径">
                        <template #append>
                            <el-button type="primary" :icon="FolderOpened" @click="selectExpPath"
                                size="small"></el-button>
                        </template>
                    </el-input>
                </el-form-item>
                <el-form-item label="扫描类型" prop="region">
                    <el-select v-model="ruleForm.scan_type" placeholder="Select" size="large">
                        <el-option v-for="(item,index) in fileType" :key="index" :label="item" :value="item" />
                    </el-select>
                </el-form-item>
                <el-form-item label="生成页数" prop="region">
                    <el-input-number style="width: 100%;" :precision="0" v-model="ruleForm.gen_page"></el-input-number>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm(ruleForm)">
                        生成文件
                    </el-button>
                </el-form-item>
            </el-form>
        </el-main>
    </el-container>
</template>


<style scoped>
.code-container {
    height: 100%;
}
</style>